<!--
 * @Description: file content
 * @Author: Wenmin He
 * @Date: 2021-07-02 16:33:15
 * @LastEditors: luojie
 * @LastEditTime: 2021-08-16 10:57:07
-->
<template>
  <view class="content">
    <view class="login-content">
      <!-- 1.3.1版本 -->
      <!-- 未勾选协议 -->
      <view class='login-title'>隔离人员健康信息填报入口</view>

      <!-- 只保留“我是入境人员”、“我是非入境人员” -->
      <view class="login-item item-flight">
        <view class="item-bg">
          <view class="bg-flight"></view>
        </view>
        <view class='item-arrow'>
          <view class="bg-arrow"></view>
        </view>
        我是入境人员
        <button
          v-if="!isSIN"
          open-type="getPhoneNumber"
          class="login-btn"
          @getphonenumber="(e)=>{getPhoneNumber(e, true, '1','1')}"
        ></button>
        <button v-else class="login-btn" @click="linkToNext('1','0','1')"></button>
      </view>
      <view class="login-item item-flight">
        <view class="item-bg">
          <view class="bg-else"></view>
        </view>
        <view class='item-arrow'>
          <view class="bg-arrow"></view>
        </view>
        我是非入境人员
        <button
          v-if="!isSIN"
          open-type="getPhoneNumber"
          class="login-btn"
          @getphonenumber="(e)=>{getPhoneNumber(e, true, '7','0')}"
        ></button>
        <button v-else class="login-btn" @click="linkToNext('7','0','0')"></button>
      </view>


      <view class='login-title'>工作人员管理入口</view>

      <view class="login-item item-admin">
        <view class="item-bg">
          <view class="bg-admin"></view>
        </view>
        <view class='item-arrow'>
          <view class="bg-arrow"></view>
        </view>
        我是隔离点工作人员

        <!-- ipad用户，已勾选协议 -->
        <!-- <button
          v-if="state && isIpad"
          class="login-btn"
          @click="linkToIpad"
        >
        </button> -->
        <!-- 手机用户，已勾选协议 -->
        <button
          v-if="!isPad && !isSIN"
          open-type="getPhoneNumber"
          class="login-btn"
          @getphonenumber="getPhoneNumber"
        ></button>
        <button class="login-btn" v-else @click="workerClickHandle"></button>
          <!-- 从深i您过来 -->
          <!-- <button
            v-if="!state && !isIpad && isShenainin"
            class="login-btn"
            @click="shenaininLogin"
          >
          </button> -->
        </view>
      <!-- <view class="modal-text">
        <checkbox-group @change="checkboxChange">
          <label>
            <checkbox
              v-model="agreeCheck"
              color="#2C9AF1"
              style="transform: scale(0.6)"
              :checked="state"
            />
          </label>
        </checkbox-group>
        <view>
          我同意深圳市大数据资源管理中心使用我所提交的信息用于快捷登录。
          <text @tap="downloadPdf">《个人信息保护政策》</text>
        </view>
      </view> -->
    </view>
    <view class='an-xin-xing-dong' @click='goPeaceOfMind'>
      <view>
        <view class='an-xin-icon'></view>
        <view class='an-xin-text'>安心小程序</view>
      </view>
    </view>
  </view>
</template>

<script>

import { login, getWxBindPhone, wxLogin, userCheck } from '@/api/login'

export default {
  props: ['phone', 'isPad', 'isSIN', 'wxCode'],
  data () {
    return {
      formData: {
        phone: "",
        agreeCheck: "",
      },
      state: true,
      isolateUser: false,
      interTm: null,
      wxCd: '',
    };
  },
  created(){
    console.log('=======created=======');
  },
  onReady () { 
    console.log('======onReady=====')
    this.updateCode();
    this.clearInt();
    this.interTm=setInterval(() => {
      this.updateCode()
    }, 10000);
  },
  
  beforeDestroy() {
    this.clearInt();
  },
  methods: {
    clearInt(){
      console.log('卸载定时器clearInt===', this.interTm)
      if(this.interTm) clearInterval(this.interTm);
    },
    goPeaceOfMind(){
				uni.navigateToMiniProgram({
					appId: 'wxc16837043fbe3599',
  					path: '/pages/home/home',
					// extraData: {
					// 	//携带参数
					// 	'data1': 'test'
					// },
					success(res) {
						// 返回成功
					}
				})
			},
    downloadPdf () {
      uni.downloadFile({
        url:`${process.env.VUE_APP_BASE_URL}/public/policy.pdf`,
        success: function (res) {
          var filePath = res.tempFilePath;
          uni.openDocument({
            filePath: filePath,
            success: function (res) {
              console.log("打开文档成功");
            },
          });
        },
      });
    },
    navIndex () {
      uni.hideLoading();
      uni.switchTab({
        url: "/pages/index/index",
      });
    },
    checkboxChange (e) {
      this.state = !this.state;
    },
    updateCode(){
      uni.login({
        provider: "weixin",
        success:  (res)=> {
          // console.log('定时刷新code===', res.code);
          this.wxCd=res.code;
          this.$store.commit('SET_WXCODE',res.code)
        },
      });
    },
    workerClickHandle () {
      if (this.isPad) {
        // 平板 则跳转平板登陆页
        this.$emit('showPadLogin')
      } else {
        //  手机端
        // 深i您跳转过来，直接登陆
        login(this.phone).then(rs => {
          console.log('深i您跳转过来，直接登陆', rs)
          this.$store.commit('SET_AUTH_STATUS', true)
        })
      }
    },

    linkToNext (personClassify, phone, fromAbroad) {
      uni.navigateTo({
          url: `/packageIsolate/pages/userBaseInfo/index?personClassify=${personClassify}&&fromAbroad=${fromAbroad}`,
        })
      //深i您过来直接登陆
      // login('19988886666').then(async res=>{

        /**
         
        //非工作人员跳转下一步页面
        let isolateUser = await this.userCheck(phone || this.phone)
        console.log('isolateUserisolateUserisolateUser,', isolateUser)
        // 已经入住的跳转到心理评估填报。  未入住跳转到信息登记页面
        if (isolateUser) {
          uni.redirectTo({
            url:'/packageIsolate/pages/isolateUser/index'
          })
        } else {
          uni.navigateTo({
            url: `/packageIsolate/pages/userBaseInfo/index?personClassify=${personClassify}`,
          });
        }
         * 
        */

       /**7.30号，变更：在填报页面，点击下一步进判断是否为隔离人员，再调不同的接口 */
        


      // })
    },
    userCheck (phone) {
      return new Promise((resolve) => {
        userCheck({ phone: phone}).then(rs => {
          console.log("是否是隔离人员：" + rs.isolateUser)
          console.log("是否是管理员：" + rs.systemUser)
          uni.setStorage({ key: 'reportType', data: rs })
          this.isolateUser = rs.isolateUser
          resolve(this.isolateUser)
        })
      })

    },
    showAgree () {
      // 普通用户授权登录
      var that = this;
      if (!that.state) {
        uni.showToast({
          title: "请先勾选同意使用个人信息",
          icon: "none", //图标，支持"success"、"loading"
          duration: 2000, //提示的延迟时间，单位毫秒，默认：1500
        });
      }
      //如果勾选了【同意使用信息】再弹出获取用户信息的授权框
      // else {
      //   uni.getUserProfile({
      //     desc: "用于完善会员资料", // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
      //     success: (res) => {
      //       uni.setStorage({ key: "avatarUrl", data: res.userInfo.avatarUrl });
      //       that.avatarUrl = res.userInfo.avatarUrl;
      //       uni.showToast({
      //         title: "获取用户信息成功，请点击登录按钮授权手机号码",
      //         icon: "none",
      //         duration: 2000,
      //       });
      //     },
      //     fail: (res) => {
      //       uni.showToast({
      //         title: "请允许获取用户信息",
      //         icon: "none",
      //         duration: 2000,
      //       });
      //     },
      //   });
      // }
    },
    //调起用户授权手机号码
    async getPhoneNumber (e, isolateUser, personClassify, fromAbroad) {
      const that=this;


      /**7.23 start */
      if(e.detail.errMsg ===  "getPhoneNumber:ok" ){
            //这里受机型与模拟器影响，errmsg信息各不相同，只能判断用户是否点击了允许按钮来判断，
            // console.log('用户允许授权')
            let that = this;
       console.log('用户确认授权=====', e)
       let { temporarySecretKey } = await wxLogin(this.wxCd)
        console.log('temporarySecretKey', e, temporarySecretKey)
        this.updateCode();
        uni.checkSession({
          async success(res){
            //允许授权
            getWxBindPhone({ ...e.detail, temporarySecretKey }).then(rs => {
              uni.setStorage({key:'telPhone',data:rs.purePhoneNumber})
              if (isolateUser) {
                that.linkToNext(personClassify, rs.purePhoneNumber, fromAbroad)
              } else {
                login(rs.purePhoneNumber, '', 'isGldWorker').then(rs=>{
                  that.$store.commit('SET_AUTH_STATUS', true)
                })
              }
            })  
          },
          fail(res){
            wxLogin(this.wxCd)
          }
        })
      }else{
          //如果没有走以上，均为点击了拒绝授权
          console.log('用户拒绝授权')
          // 通常会在这里弹出模态框，引导用户点击允许授权
          //用户拒绝授权
          //拒绝授权后弹出一些提示
          uni.showModal({
            title: "提示",
            content: "请允许授权手机号码",
            showCancel: false,
          });
      }
      /**7.23 end */

    },
  },
};
</script>

<style lang="scss" scoped>
.content {
  width: 100%;
  padding: 40rpx;
  box-sizing: border-box;
}
.an-xin-xing-dong{
  height:138rpx;
  line-height:138rpx;
  background: linear-gradient(180deg, #67BBFF 0%, #2C9AF1 100%);
  box-shadow: 0px 10rpx 20rpx rgba(44, 154, 241, 0.42);
  opacity: 1;
  border-radius: 16rpx;
  text-align: center;
  position: fixed;
  bottom:60rpx;
  left:40rpx;
  right:40rpx;
  .an-xin-icon{
    background:red;
    width:75rpx;
    height:75rpx;
    background:url('https://szgd-dev.tgovcloud.com/public/images/an-xin-xing-dong.png')no-repeat;
    background-size: 100% 100%;
    display:inline-block;
    vertical-align: middle;
  }
  .an-xin-text{
    font-size:36rpx;
    color:#fff;
    display:inline-block;
    vertical-align: middle;
    margin-left:28rpx;
  }
}
.modal {
  padding: 40rpx;
  background-color: #fff;
  border-radius: 20rpx;
  box-sizing: border-box;
  &-title {
    text-align: center;
    padding: 40rpx;
  }
  &-bg {
    text-align: center;
    &-tip {
      font-size: 36rpx;
      font-weight: 500;
      color: #000;
      margin: 20rpx auto;
    }
    image {
      width: 60%;
      margin: 20rpx auto;
    }
  }
  &-text {
    display: flex;
    color: #333333;
    font-size: 28rpx;
    align-items: baseline;
    text {
      color: #2c9af1;
    }
  }
  .submit-btn {
    color: #fff;
    background-color: #2c9af1;
    text-align: center;
    border-radius: 10rpx;
    margin-top: 80rpx;
    font-size: 34rpx;
    border-radius: 16rpx;
    outline: none;
  }
}
.login-content {
  box-sizing: border-box;
  padding-top: 32rpx;
  width: 100%;
  .login-title{
    font-size:40rpx;
    color:#000;
    font-weight:500;
    font-family: PingFang SC;
    margin-bottom:32rpx;
  }
  .login-item {
    height: 138rpx;
    line-height: 138rpx;
    width: 100%;
    border: none;
    padding: 0;
    margin-bottom: 32rpx;
    box-sizing: border-box;
    position: relative;
    padding-left: 140rpx;
    text-align: left;
    font-size: 36rpx;
    color: #000;
    font-family: "PingFang SC";
    font-weight: 400;
    border-radius: 16rpx;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
    .item-bg {
      // background: url("https://szgd-dev.tgovcloud.com/public/images/login/icon-admin.png") no-repeat;
      background: #fff;
      border-radius: 50%;
      position: absolute;
      top: 32rpx;
      left: 40rpx;
      width: 75rpx;
      height: 75rpx;
      .bg-admin {
        height: 100%;
        width: 100%;
        background: url("https://szgd-dev.tgovcloud.com/public/images/login/icon-admin.png") no-repeat;
        background-position: center center;
        background-size: 100%;
      }
      .bg-hongkong {
        height: 100%;
        width: 100%;
        background: url("https://szgd-dev.tgovcloud.com/public/images/login/icon-hongkong.png") no-repeat;
        background-position: center center;
        background-size: 100%;
      }
      .bg-flight {
        height: 100%;
        width: 100%;
        background: url("https://szgd-dev.tgovcloud.com/public/images/login/icon-flight.png") no-repeat;
        background-position: center center;
        background-size: 100%;
      }
      .bg-else {
        height: 100%;
        width: 100%;
        background: url("https://szgd-dev.tgovcloud.com/public/images/login/icon-else.png") no-repeat;
        background-position: center center;
        background-size: 100%;
      }
    }
    .item-arrow{
      position:absolute;
      right:44rpx;
      top:58rpx;
      .bg-arrow{
        width:20rpx;
        height:20rpx;
        background:url('https://szgd-dev.tgovcloud.com/public/images/login/arrow-right.png')no-repeat;
        background-size:100% 100%;
      }
    }
    .login-btn {
      width: 100%;
      height: 100%;
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      opacity: 0;
    }
  }
  .item-admin {
    // background-image: linear-gradient(
    //   to right,
    //   rgba(253, 149, 136, 1),
    //   rgba(255, 139, 124, 1)
    // );
  }
  .item-hongkong {
    // background-image: linear-gradient(
    //   to right,
    //   rgba(122, 180, 250, 1),
    //   rgba(77, 156, 253, 1)
    // );
  }
  .item-flight {
    // background-image: linear-gradient(
    //   to right,
    //   rgba(253, 200, 109, 1),
    //   rgba(255, 172, 30, 1)
    // );
  }
  .item-else {
    // background-image: linear-gradient(
    //   to right,
    //   rgba(104, 219, 174, 1),
    //   rgba(0, 195, 119, 1)
    // );
  }
}
</style>
